<template>
	<div class="easyd-weixin-Box app_page">

		<div class="app_list_box" v-if="generalStaff">
			<div class="app_box_content_list T1">
				权限不足，无法查看
			</div>
		</div>
		<div class="" v-else>
			<div class="app_list_box MARGIN_BOTTOM_10">
				<div class="app_box_content_list T1">
					<p>自有团队销售总数：{{commissionData.allBuyCount}}单</p>
					<p>自有团队销售总额：{{commissionData.allBuyMoney}}元</p>
					<p>提成比例：{{commissionData.commissionRulesData}}%</p>
					<p>提成金额：{{commissionData.allCommissionMoney}}元</p>
				</div>
			</div>

			<div class="app_list_box MARGIN_BOTTOM_10" v-if="$userData.getOsType() == 1">
				<div class="app_box_content_list T1">
					<p>代理商销售总数：{{commissionData.agentAllBuyCount}}单</p>
					<p>代理商销售总额：{{commissionData.agentAllBuyMoney}}元</p>
					<p>提成比例：{{commissionData.agentCommissionRulesData}}%</p>
					<p>提成金额：{{commissionData.agentAllCommissionMoney}}元</p>
				</div>
			</div>

			<div class="app_list_box MARGIN_BOTTOM_10">
				<div class="app_box_content_list T1">
					<p>总提成金额：{{commissionData.totalProfits}}元</p>
					<p>剩余结算金额：{{commissionData.remainingMoney}}元</p>
				</div>
				<div class="app_box_content">
					<div class="app_box_content_left">
						提成记录
					</div>
					<div class="app_box_content_right">
						<span class="C4">{{settlementDataLength}}次</span>
					</div>
				</div>
				<div class="app_box_content_list" v-for="(item,index) in commissionData.settlementData">
					<div class="app_box_flex record_list">
						<div class="app_box_flex_1">
							<p>第{{settlementDataLength - index}}次计算</p>
							<p>{{$common.getTimes(item.sr_create_time)}}</p>
						</div>
						<div class="app_box_flex_1">
							<p><small>¥</small><span>{{item.sr_money}}</span></p>
							<p class="C4">已结算</p>
						</div>
					</div>
				</div>
			</div>
		</div>

	</div>
</template>

<script>
	import { mapState, mapMutations } from "vuex";
	export default {

		data() {
			return {
				generalStaff: true, //普通员工
				settlementDataLength: 0, //提成记录
			};
		},
		computed: {
			...mapState({
				commissionData: state => state.UserModule.commissionData, //数据
			}),
		},
		mounted() {
			//			this.initData();
			if(this.$userData.getOsType() == 2 && this.$userData.getIsManager() == 1) {
				console.log('代理商管理身份')
				this.initData('daili');
				this.generalStaff = false;
			} else if(this.$userData.getOsType() == 1 && this.$userData.getIsManager() == 1) {
				console.log('战略管理身份')
				this.initData('zhanlue');
				this.generalStaff = false;
			} else {
				console.log('员工身份')
				this.generalStaff = true;
			}
		},
		methods: {

			//  ...mapMutations(["ShopIndexModule/updateIsShopGuide"]),

			initData(type) {
				var params = {
					'os_id': this.$userData.getOsid()
				};

				var urls = '';

				if(type == 'daili') {
					urls = this.$API.apiSearchAgentCommissionRecord;
				} else if(type == 'zhanlue') {
					urls = this.$API.apiSearchTeamCommissionRecord;
				} else {
					console.log('啥都不是');
					return;
				}

				this.$easyUtil.startLoading(this);
				this.$http.postHttp(
					urls,
					params,
					rs => {
						console.log(rs);
						this.$easyUtil.endLoading(this);
						this.$store.commit("UserModule/updateCommissionData", rs);
						this.settlementDataLength = this.commissionData.settlementData.length;
					}
				);

			},
		}
	};
</script>

<style lang="stylus" scoped>
	@import '~PUBLIC_CSS';
	.record_list {}
	
	.record_list .app_box_flex_1:last-child {
		text-align: right;
	}
	
	.record_list .app_box_flex_1 span {
		color: #FBD415;
	}
</style>